<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8">	<meta name="viewport" content="width=device-width, initial-scale=1">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <link rel="icon" href="https://static.jianshukeji.com/hcode/images/favicon.ico">
        <style>
            /* css 代码  */
			#container {
				max-width: 800px;
				margin: 1em auto;
			}
			input[type="number"] {
				min-width: 50px;
			}
        </style>
        <script src="https://code.highcharts.com.cn/highcharts/highcharts.js"></script>
        <script src="https://code.highcharts.com.cn/highcharts/modules/exporting.js"></script>
        <script src="https://code.highcharts.com.cn/highcharts/modules/oldie.js"></script>
    </head>
    <body>
        <div id="container"></div>
        <script src="https://code.highcharts.com.cn/highcharts/modules/item-series.js"></script>
        <script>
            // JS 代码 
			Highcharts.chart('container', {
				chart: {
					type: 'item'
				},
				title: {
					text: '饼图'
				},
				subtitle: {
					text: '饼图'
				},
				legend: {
					labelFormat: '{name} <span style="opacity: 0.4">{y}</span>'
				},
				series: [{
					name: 'Representatives',
					keys: ['name', 'y', 'color', 'label'],
					data: [
						['The Left', 5000, '#BE3075', 'DIE LINKE'],
						['Social Democratic Party', 153, '#EB001F', 'SPD'],
						['Alliance 90/The Greens', 67, '#64A12D', 'GRÜNE'],
						['Free Democratic Party', 80, '#FFED00', 'FDP'],
						['Christian Democratic Union', 200, '#000000', 'CDU'],
						['Christian Social Union in Bavaria', 46, '#008AC5', 'CSU'],
						['Alternative for Germany', 94, '#009EE0', 'AfD']
					],
					dataLabels: {
						enabled: true,
						format: '{point.label}'
					},
					// Circular options
					center: ['50%', '88%'],
					size: '170%',
					startAngle: -100,
					endAngle: 100
				}]
			});

        </script>
    </body>
</html>